<script setup>
import { ref, onUnmounted, nextTick } from "vue";
import { appPassword } from "@/services/login";
import { updatePhone, checkPhone } from "@/services/setting";
import { useUserStore } from "@/stores/user.js";

const form = ref({
  oldPsw: "",
  newPsw: "",
  confirmPsw: "",
});
const showOldPsw = ref(false);
const showNewPsw = ref(false);
const showConfirmPsw = ref(false);

const save = async () => {
  if (!form.value.oldPsw) {
    return uni.showToast({
      title: "请输入旧密码",
      icon: "none",
    });
  }
  if (!form.value.newPsw) {
    return uni.showToast({
      title: "请输入新密码",
      icon: "none",
    });
  }
  if (!form.value.confirmPsw) {
    return uni.showToast({
      title: "请输入确认密码",
      icon: "none",
    });
  }
  if (form.value.newPsw !== form.value.confirmPsw) {
    return uni.showToast({
      title: "两次密码不一致",
      icon: "none",
    });
  }
  try {
    const res = await appPassword({
      oldPsw: form.value.oldPsw,
      newPsw: form.value.newPsw,
      confirmPsw: form.value.confirmPsw,
    });
    if (res.code === 200) {
      uni.showToast({
        title: "修改成功",
        icon: "success",
      });
      uni.removeStorageSync("user");
      uni.removeStorageSync("X-Auth-Token");

      uni.reLaunch({ url: "/pages/login/login" });
    }
  } catch (e) {
    uni.showToast({
      title: e.msg,
      icon: "none",
    });
  }
};
</script>
<template>
  <top-nav :title="'修改密码'" :border="false" rType="save"></top-nav>
  <view class="login"
    ><up-form labelWidth="auto" labelPosition="left" :model="form" ref="form">
      <up-form-item
        label="旧密码"
        prop="oldPsw"
        :borderBottom="true"
        ref="item1"
      >
        <up-input
          v-model="form.oldPsw"
          placeholder="请输入旧密码"
          :type="showOldPsw ? 'text' : 'password'"
          border="none"
        >
          <template #suffix>
            <up-icon
              @click="showOldPsw = !showOldPsw"
              :name="showOldPsw ? 'eye-off' : 'eye'"
              size="40rpx"
              color="#303133"
            ></up-icon> </template
        ></up-input>
      </up-form-item>
      <up-form-item
        label="新密码"
        prop="newPsw"
        :borderBottom="true"
        ref="item1"
      >
        <up-input
          v-model="form.newPsw"
          placeholder="请输入新密码"
          :type="showNewPsw ? 'text' : 'password'"
          border="none"
        >
          <template #suffix>
            <up-icon
              :name="showNewPsw ? 'eye-off' : 'eye'"
              @click="showNewPsw = !showNewPsw"
              size="40rpx"
              color="#303133"
            ></up-icon>
          </template>
        </up-input>
      </up-form-item>
      <up-form-item
        label="确认新密码"
        prop="confirmPsw"
        :borderBottom="true"
        ref="item1"
      >
        <up-input
          v-model="form.confirmPsw"
          placeholder="请输入确认密码"
          :type="showConfirmPsw ? 'text' : 'password'"
          border="none"
        >
          <template #suffix>
            <up-icon
              @click="showConfirmPsw = !showConfirmPsw"
              :name="showConfirmPsw ? 'eye-off' : 'eye'"
              size="40rpx"
              color="#303133"
            ></up-icon> </template
        ></up-input>
      </up-form-item>
    </up-form>

    <button class="btn" @click="save">保存</button>
  </view>
</template>

<style lang="scss" scoped>
@import "index.scss";
</style>
